<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>

</head>
<body>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="layui-row">
                <form class="layui-form" lay-filter="myform" id="myform">
                    <input type="reset" id="btReset" class="layui-hide" >
                    <div class="layui-form-item">
                        <label class="layui-form-label">名称</label>
                        <div class="layui-input-inline">
                            <input type="text" name="name" id="name"  autocomplete="off" class="layui-input">
                        </div>
                        <label class="layui-form-label">题型</label>
                        <div class="layui-input-inline">
                            <select name="questionType" id="questionType"></select>
                        </div>
                        <label class="layui-form-label">语言</label>
                        <div class="layui-input-inline">
                            <select name="lg" id="lg"></select>
                        </div>
                        <label class="layui-form-label">难度</label>
                        <div class="layui-input-inline">
                            <select name="difficulty" id="difficulty"></select>
                        </div>
                        <label class="layui-form-label">试题来源</label>
                        <div class="layui-input-inline">
                            <select name="source" id="source"></select>
                        </div>
                        <label class="layui-form-label">试题类型</label>
                        <div class="layui-input-inline">
                            <select name="contentType" id="contentType"></select>
                        </div>
                    </div>

                    <div class="layui-form-item" style="text-align: center">
                        <div class="layui-inline" style="margin-left: 5px;">
                            <div class="layui-btn-group">
                                <button type="button" class="layui-btn layui-btn-primary" data-type="query"><i class="layui-icon">&#xe615;</i>查询</button>
                                <button type="button" class="layui-btn layui-btn-primary" data-type="resetBtn"><i class="layui-icon">&#xe669;</i>重置</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="row">
                <table class="layui-hide"  id="main-table" lay-filter="main-table"></table>
            </div>
        </div>
    </div>
</div>

<script th:inline="none"></script>
<script>
    let paperId = (`[[${paperId}]]`);

    layui.use(['table','form','element'], function(){
        var table = layui.table,
            form = layui.form;
        createSelect("paper-lg","lg",form,'','请选择');
        createSelect("question-source","source",form,'','请选择');
        createSelect("question-difficulty","difficulty",form,'','请选择');
        createSelect("paper-type","contentType",form,'','请选择');
        createSelect("question-type","questionType",form,'','请选择');
        table.render({
            elem: '#main-table'
            ,height: 650
            ,url: 'libQuestion/getPageList'
            ,title: '试卷列表'
            ,page: true
            ,limit:20
            ,cols: [
                [
                    {type: 'checkbox'}
                    ,{field: 'text', title: "题干"}
                    ,{field: 'questionTypeTxt',title: "题型",width: 80}
                    ,{field: 'pianName', title: "篇",width:180}
                    ,{field: 'chapterName', title: "章",width:180}
                    ,{field: 'jieName', title: "节",width:250}

                ]
            ]
            ,done:function(){
                enableRowClick(table,form,'main-table',"main-table");
            }
        });
        window.getIds = function (){
            var checkStatus = table.checkStatus('main-table');
            let data = checkStatus.data;
            let ids = [];
            for(var i=0;i<data.length;i++){
                ids.push({id:data[i].id,name:data[i].name});
            }
            return ids;
        }

        var $ = layui.$, active = {
            query: function(){
                table.reload("main-table",{where:{name:$("#name").val(),difficulty:$("#difficulty").val()
                        ,lg:$("#lg").val(),questionType:$("#questionType").val(),contentType:$("#contentType").val()
                        ,source:$("#source").val()}})
            },
            resetBtn:function () {
                $("#btReset").click();

            }
        };
        $('.layui-form .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });

</script>
</body>
</html>